<!DOCTYPE html>
<html lang="cn">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Document</title>
	<link rel="stylesheet" href="./css/common.css?version=1.2.8">
    <link rel="stylesheet" href="./css/01/03.css?version=1.2.8">
    <link rel="stylesheet" href="./css/swiper.min.css">
	<script src="./js/jquery-2.2.4.min.js?version=1.2.8"></script>
	<script src="./js/fastclick.js?version=1.2.8"></script>
	<!-- <script src="../js/template-native.js"></script> -->
    <script src="./js/iscroll-probe.min.js"></script>
    <script src="./js/hammer.min.js"></script>
</head>

<body>
	<div class="c-content mainIndex3">
		<!--********************************* top model*********************************** -->


		<div class="top-model" id="top-model">
			<div class="top-content"> 
				<div class="system">
                    <!-- <a class="goback-syz bg-color-bg" onclick="bzApi.close()">
                        <img src="./img/03/back3.png" alt="">
                    </a> -->
                    <a class="goback-sys bg-color-bg">
                        <img src="./img/system/change.png" alt="">
                    </a>
                    <a class="gonext-sys bg-color-bg">
                        <img src="./img/system/setting.png" alt="">
                    </a>
					<div class="truemodel">
						<div class="truelists">选择模板</div>
						<div class="changekh">修改口号</div>
						<div class="jgsj">间隔时间</div>
					</div>
				</div>
				<div class="top_title">
					<h1 class="topLeft"></h1>
					<p class="titlep"></p>
				</div>
				<div class="main">
					<ul class="main_left">
						<li onclick="changetogo(1)">
							<h3>
								<i>部</i>
								<i>门</i>
								<i>简</i>
								<i>介</i>
							</h3>
                            <textarea style="height: 153px;" id="textareaW" readonly>
                            </textarea>
							<div id="insterNEST">
                                <!-- <dl style="margin-left: 30px;">
                                    <dt>班组成员12人</dt>
                                    <dt>工程师人</dt>
                                    <dt>技师人</dt>
                                </dl>
                                <dl>
                                    <dt>大专及以上学历66人</dt>
                                    <dt>助理工程师37人</dt>
                                    <dt>高级工43人</dt>
                                </dl>
                                <dl>
                                    <dt>中共党员37人</dt>
                                    <dt>平均年龄25岁</dt>
                                </dl> -->
							</div>
                        </li>
                        
						<div class="unitMembers" onclick="changetogo(2)">
                            <h3>
                                <i>部</i>
                                <i>门</i>
                                <i>成</i>
                                <i>员</i>
                            </h3>
                            <div class="leader">
                                <!-- <div class="leaderWrap">
                                    <div>
                                        <img src="./img/03/avatar.png" alt="" />
                                        <dl>
                                            <dd>张振华</dd>
                                            <dt>班长</dt>
                                        </dl>
                                    </div>                              
                                </div>-->
                            </div>
                            <div class="member">
                                <!-- <div>
                                    <img src="./img/03/avatar.png" alt="" />
                                    <dl>
                                        <dd>张振华</dd>
                                        <dt>安全员</dt>
                                    </dl> 
                                </div>
                                <div>
                                    <img src="./img/03/avatar.png" alt="" />
                                    <dl>
                                        <dd>张振华</dd>
                                        <dt>消防员</dt>
                                    </dl> 
                                </div>
                                <div>
                                    <img src="./img/03/avatar.png" alt="" />
                                    <dl>
                                        <dd>张振华</dd>
                                        <dt>成员</dt>
                                    </dl> 
                                </div>
                                <div>
                                    <img src="./img/03/avatar.png" alt="" />
                                    <dl>
                                        <dd>张振华</dd>
                                        <dt>成员</dt>
                                    </dl> 
                                </div>
                                <div>
                                    <img src="./img/03/avatar.png" alt="" />
                                    <dl>
                                        <dd>张振华</dd>
                                        <dt>成员</dt>
                                    </dl> 
                                </div>
                                <div>
                                    <img src="./img/03/avatar.png" alt="" />
                                    <dl>
                                        <dd>张振华</dd>
                                        <dt>成员</dt>
                                    </dl> 
                                </div>
                                <div>
                                    <img src="./img/03/avatar.png" alt="" />
                                    <dl>
                                        <dd>张振华</dd>
                                        <dt>成员</dt>
                                    </dl> 
                                </div>
                                <div>
                                    <img src="./img/03/avatar.png" alt="" />
                                    <dl>
                                        <dd>张振华</dd>
                                        <dt>成员</dt>
                                    </dl> 
                                </div> -->
                            </div>
                        </div>
                    </ul>
                    <ul class="main-mid">
<!--------------------------------- 风采剪影 ------------------------------------>
                        <li class="croper-section" onclick="changetogo(3)">
                            <div class="b-cropper flex-column">
                                <div class="cropper-t-rtr"><img src="./img/03/honner_b3.png" alt=""></div>
                                <!-- <div class="cropper-wrap flex-column">
                                    <div class="cropper-top flex-row">
                                        <div class="cropper-t-l">
                                            <img src="./img/03/honner_b1.png" alt="">
                                        </div>
                                        <div class="cropper-t-r flex-column">
                                            <div class="cropper-t-rt flex-row">
                                                <div class="cropper-t-rtl"><img src="./img/03/honner_b2.png" alt=""></div>
                                                <div class="cropper-t-rtr"><img src="./img/03/honner_b3.png" alt=""></div>
                                            </div>
                                            <div class="cropper-t-rb"><img src="./img/03/honner_b4.png" alt=""></div>
                                        </div>                                  
                                    </div>
                                    <div class="cropper-bottom"><img src="./img/03/honner_b5.png" alt=""></div>    
                                </div>-->
                            </div>
                        </li>
<!--------------------------------- 部门荣誉 ------------------------------------>
                        <li class="honner-section clearfix"  onclick="changetogo(4)">
                            <div class="honner-left">部门荣誉</div>
                            <ul class="honner-right flex-row">
                                <!-- <li><img src="./img/03/honner_b6.png" alt=""></li>
                                <li><img src="./img/03/honner_b6.png" alt=""></li>
                                <li><img src="./img/03/honner_b6.png" alt=""></li>
                                <li><img src="./img/03/honner_b6.png" alt=""></li> -->
                            </ul>
                        </li>
                    </ul>
                    <div class="main_right">
<!--*******************************要务公开************************************-->
                        <div>
                            <div class="classIntru affair-title" onclick="changetogo(5)"><a>要务公开</a></div>
                        </div>
                        <div class="p_open bg-color-border">                                               
                            <div class="public_affair">
                                <div class="swiper-container">
                                    <div class="swiper-wrapper">
                                        <!-- <div class="swiper-slide box_bg area_1 swiper-no-swiping">
                                            <h4 class="public_affair_tit">“检修创优”岗位竞赛评比</h4>
                                            <div class="affairImgWrap">
                                                <img src="./img/02/affair_file.png" alt="">
                                            </div>
                                            <div class="affair_file_content">
                                                <div class="public_affair_tit">附件</div>
                                                <ul class="affair_file_ul">
                                                    <li><a href="">运行部党支部“三亮一比、对标管理”活动实施方案.doc</a></li>
                                                    <li><a href="">检修部党支部开展“争A创优、党员带头”.主题活动实施方案doc</a></li>
                                                    <li><a href="">运行部党支部“三亮一比、对标管理”活动实施方案.xls</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                        <div class="swiper-slide box_bg area_1 swiper-no-swiping">
                                            <h4 class="public_affair_tit">“检修创优”岗位竞赛评比</h4>
                                            <div class="affairImgWrap">
                                                <img src="./img/02/affair_file.png" alt="">
                                            </div>
                                            <div class="affair_file_content">
                                                <div class="public_affair_tit">附件</div>
                                                <ul class="affair_file_ul">
                                                    <li><a href="">运行部党支部“三亮一比、对标管理”活动实施方案.doc</a></li>
                                                    <li><a href="">检修部党支部开展“争A创优、党员带头”.主题活动实施方案doc</a></li>
                                                    <li><a href="">运行部党支部“三亮一比、对标管理”活动实施方案.xls</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                        <div class="swiper-slide box_bg area_1 swiper-no-swiping">
                                            <h4 class="public_affair_tit">“检修创优”岗位竞赛评比</h4>
                                            <div class="affairImgWrap">
                                                <img src="./img/02/affair_file.png" alt="">
                                            </div>
                                            <div class="affair_file_content">
                                                <div class="public_affair_tit">附件</div>
                                                <ul class="affair_file_ul">
                                                    <li><a href="">运行部党支部“三亮一比、对标管理”活动实施方案.doc</a></li>
                                                    <li><a href="">检修部党支部开展“争A创优、党员带头”.主题活动实施方案doc</a></li>
                                                    <li><a href="">运行部党支部“三亮一比、对标管理”活动实施方案.xls</a></li>
                                                </ul>
                                            </div>
                                        </div> -->
                                    </div>
                                    <div class="swiper-pagination"></div>
                                </div>                              
                            </div>  
                        </div>
                    </div>
					<!-- <ul class="main_right">
                        <li class="edit_dream" onclick="changetogo(3)">
                            <h3>
                                <i>部</i>
                                <i>门</i>
                                <i>愿</i>
                                <i>景</i>
                            </h3>
                            <textarea id="classhope" readonly></textarea>

                        </li>
						<li>
							<h3>
								<i>班</i>
								<i>务</i>
								<i>公</i>
								<i>开</i>
							</h3>
							<ul class="ul_nav">
								<li id="select-new" class="active">考勤表</li>
								<li id="select-2">值班表</li>
								<li id="select-3">月度绩效考核</li>

							</ul>
							<div class='ul_time'>
								<span id="newDate">
								</span>
								<i id="kaoqin" class="colornew" style="display: none;"></i>
								<i id="zhiban" class="colornew" style="display: none;">值班表</i>
							</div>
							<ul class="ul_content">

								<li class="comonScroll attendance" id="select-4" style="display:block;">
									<table id="morework">
									</table> 
								</li>
								<li class="comonScroll duty" id="select-5">
									<table id="newtable">

									</table>
								</li>
								<li style="overflow: hidden" id="charts">
									<div class="data-table">
										<div class="t_l">
											<table id="new-meassage">
											</table>
											<div class="t_l_freeze">
												<table id="table-end">

												</table>
											</div>
										</div>
										<div class="t_r">
											<div class="t_r_t">
												<table>
													<tbody id="table-top">
													</tbody>
												</table>
											</div>
											<div class="t_r_content">
												<table>
													<tbody id="tob-content">

													</tbody>
												</table>
											</div>
										</div>
									</div>
									<div id="warning" style="display:none;text-align: center;padding-top: 167px;">
										温馨提示，您还没有上报绩效</div>
								</li>
							</ul>

						</li>
					</ul> -->
				</div>
			</div>

			<div class="mid-model">
				<div class="mid-left">
					<div>
						<div>
							<div class="classIntru"></div>
						</div>
						<div></div>
					</div>
				</div>
				<div>

				</div>
				<div class="mid-right">
					<div></div>
					<div>
						<div class="tv-title">

						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- 个性化弹窗 -->
		<div class="diago" style="display: none;">
			<div class="diado-content diago-active">
				<div class="diago-title bg-color-bg">
					<div class="diago-left">个性化设置</div>
					<div class="diago-close"></div>
				</div>
				<div class="model-content">
					<div class="model-list">
						<ul class="clearfix">
							<li class="active">
								<div class="modelDiv">
									<p>模板一</p>
									<span class="modelSpan"></span>
								</div>
							</li>
							<li>
								<div class="modelDiv">
									<p>模板二</p>
									<span class="modelSpan"></span>
								</div>
							</li>
							<li>
								<div class="modelDiv">
									<p>模板三</p>
									<span class="modelSpan"></span>
								</div>
							</li>
							<li>
								<div class="modelDiv">
									<p>模板四</p>
									<span class="modelSpan"></span>
								</div>
							</li>
						</ul>
					</div>
				</div>
				<div class="diago-bottom">
					<div class="totrue">确定</div>
					<div class="cancel">取消</div>
				</div>
				<div class="choose">

				</div>
			</div>
		</div>
		<!--********************************* top templete*********************************** -->
		<!--<div class="edit">
			<button id="btn">111</button>
			<textarea id="index0">
	
			</textarea>
			<textarea class="a-c-c" id="a-c-c">
					设备维护部电气二次班组成立于2013年,是由电气保护、电测仪表、运动、高压
			</textarea> 
		</div>-->
		<div class="diagoT">
			<div class="diago-content">
				<div class="diago-title bg-color-bg">
					<div class="diago-left">口号设置</div>
					<div class="diago-close"></div>
				</div>
				<div class="cont-diago">
					<input type="text" id="cont-value">
				</div>
				<div class="diago-bottom">
					<div class="btn">确定</div>
					<div class="cancelbtn">取消</div>
				</div>
			</div>
		</div>
		<div class="diagoTime">
			<div class="diago-content" style="width:600px;">
				<div class="diago-title bg-color-bg" style="width:600px;">
					<div class="diago-left">间隔修改</div>
					<div class="diago-close"></div>
				</div>
				<div class="cont-diagoTime">
					<div class="itemt">
						3s
					</div>
					<div class="itemt">
						5s
					</div>
					<div class="itemt">
						10s
					</div>
					<div class="itemt">
						20s
					</div>
				</div>
				<div class="diago-bottom">
					<div class="btnTime">确定</div>
					<div class="cancelbtn">取消</div>
				</div>
			</div>
        </div>
        <div id="popup">
            <div class="bg">
                <img src=""/>
            </div>
        </div>

		<!--********************************* top templete*********************************** -->
		<script src="./js/echarts3.8.5_min.js?version=1.2.8"></script>
		<script src="./js/config.js?version=1.2.8"></script>
		<script>
			var app = document.querySelector('body');
			var hammertime = new Hammer(app);
			hammertime.on('swipeleft', function(ev) {
				// console.log(ev);
				bzApi.close()
			});
			//*******************************模拟数据***************************************//
			var topData = {
				'className': '电气二次班',
				'title01': "团结凝聚力",
				'title02': "创建迎来希望",
				'title03': "班组简介",
				'title04': "班组成员",
				'title05': "班组愿景",
				'title06': "风采剪影",
				'title07': "班组荣誉",
				'title08': "学习园地",
			}
			// var back = template('temp01', topData);
			// $("#top-model").html(back);
			//    $(".bgcolor").css('backgroundColor',localStorage.getItem('color'));
			$(".bgcolor").css('backgroundColor', '#0e0e4e');
			$('.ul_nav li').click(function () {
				var index = $(this).index()
				$('.ul_time i').eq(0).html($(this).html())
				$(this).addClass('active').siblings().removeClass('active')
				$('.ul_content li').eq(index).show().siblings().hide()
				$('.ul_time').children().eq(index).show().siblings().hide();
				$("#kaoqin").html('<span>' + month + '月考勤表</span>');
			})


			$("#btn").click(
				function () {
					var x = $("#index0").val();
					$('#a-c-c').html(x);
				}
			)

			$('.c-list').click(
				function (index) {
					$('.c-list').removeClass('bg-color-bg');
					$('.c-list-node').removeClass('active');
					$('.c-list-node').eq($(this).index()).addClass('active');
					$(this).addClass('bg-color-bg');
				}
			)
			$(".gonext-sys").click(
				function () {
					if ($(".truemodel").css("display") == "block") {
						$(".truemodel").css("display", "none");
					} else {
						$(".truemodel").css("display", "block");
					}
				}
			)
			$(".truelists").click(
				function () {
					$(".diago").css("display", "block");
				}
			)
			var numT = 0;
			$('.model-list ul li').click(function () {
				$(this).addClass('active').siblings().removeClass('active');
				numT = $(this).index();
			})

			var jpathurl = '?userId=' + userId + "&bzId=" + bzId + "&regDeptId=" + regDeptId;
			$(".totrue").click(
				function () {
					$(".diago").css("display", "none");
					if (numT == 0) {
						location.href = "./index.html" + jpathurl
						localStorage.setItem("module2", 1)
					} else if (numT == 1) {
						location.href = "./index2.html" + jpathurl
						localStorage.setItem("module2", 2)
					} else if (numT == 2) {
						location.href = "./index3.html" + jpathurl
						localStorage.setItem("module2", 3)
					} else if (numT == 3) {
						location.href = "./index4.html" + jpathurl
						localStorage.setItem("module2", 4)
					}
				}
			)
			$(".goback-sys").click(
				function () {
					location.href = "./index2.html" + jpathurl
					localStorage.setItem("module2", 2)
				}
			)
			$(".diago-close").click(
				function () {
					$(".diagoT").css("display", "none");
					$(".diago").css("display", "none");
					$(".diagoTime").css("display", "none");
					$(".truemodel").css("display", "none");
				}
			)
			$(".jgsj").click(
				function () {
					if (timeSet == 3000) {
						$(".itemt").removeClass("active");
						$(".itemt").eq(0).addClass("active");
					} else if (timeSet == 5000) {
						$(".itemt").removeClass("active");
						$(".itemt").eq(1).addClass("active");
					} else if (timeSet == 10000) {
						$(".itemt").removeClass("active");
						$(".itemt").eq(3).addClass("active");
					} else if (timeSet == 20000) {
						$(".itemt").removeClass("active");
						$(".itemt").eq(3).addClass("active");
					}
					$(".diagoTime").css("display", "block");
				}
			)
			$(".cancel").click(
				function () {
					$(".diago").css("display", "none");
					$(".truemodel").css("display", "none");
					$(".diagoTime").css("display", "none");
				}
			)
			$(".changekh").click(
				function () {
					$(".diagoT").css("display", "block");
					$("#cont-value").val($(".titlep").text());
					console.log($(".titlep").text())
				}
			)
			$(".btn").click(
				function () {
					kouhao();
					$(".diagoT").css("display", "none");
					$(".truemodel").css("display", "none");
				}
			)
			$(".cancelbtn").click(
				function () {
					$(".diagoT").css("display", "none");
					$(".truemodel").css("display", "none");
					$(".diagoTime").css("display", "none");
				}
			)
			var timeSet = 10000;
			if (localStorage.getItem('timeSet')) {
				timeSet = localStorage.getItem('timeSet');
			}
			$(".itemt").click(
				function (index) {
					var index = $(this).index();
					$(".itemt").removeClass('active');
					$(this).addClass("active");
					if (index == 0) {
						timeSet = 3000;
					} else if (index == 1) {
						timeSet = 5000;
					} else if (index == 2) {
						timeSet = 10000;
					} else if (index == 3) {
						timeSet = 20000;
					}
				}
			)
			$(".btnTime").click(
				function () {
					$(".diagoTime").css("display", "none");
					$(".truemodel").css("display", "none");
					localStorage.setItem('timeSet', timeSet);
				}
			)
			//编辑口号
			function kouhao() {
				var summaryList = $("#cont-value").val();
				var SaveWallInfo = new FormData();
				var saveParams = {
					userId: userId,
					data: {
						bzId: bzId,
						slogan: summaryList,
						savetype: "slogan"
					}
				}
				SaveWallInfo.append(
					'json', JSON.stringify(saveParams)
				)
				$.ajax({
					url: baseUrl + 'api/Culture/SaveWallInfo',
					data: SaveWallInfo,
					type: "POST",
					contentType: false,
					processData: false,
					success: function (data) {
						console.log(data);
						location.href = "./index3.html" + jpathurl
						// location.href="./detail1.html?number=2"
					}
				})
			}

			function changetogo(index) {
				location.href = "./detail/detail3.html?number=" + index + '&userId=' + userId + "&bzId=" + bzId + "&regDeptId=" +
					regDeptId;
			}
		</script>
        <script src="./js/main3.js?version=1.2.81"></script>
        <script src="./js/swiper.min.js"></script>		
		<script>
        // 轮播
        //  // 点击全屏预览，再点击收缩
        //  function showBig(src,k){
        //         debugger
        //         $('#popup img').attr('src',src);
        //         var j = $(window).width()/$(window).height();
        //         if(j<k){
        //             $('#popup img').css({
        //                 'width': '100%',
        //                 'height': 'auto'
        //             })
        //         }else{
        //             $('#popup img').css({
        //                 'width': 'auto',
        //                 'height': '100%'
        //             })
        //         }
        //         $('#popup').show()
        //     }

        //     $('.affairImgWrap').click(function(event){
        //         event = event||window.event;
        //         var target = document.elementFromPoint(event.clientX, event.clientY);
        //         k =event.target.offsetWidth/event.target.offsetHeight
        //         showBig(target.src,k);
        //     })

        //     $('#popup').click(function(){
        //         $(this).hide()
        //     })
        // var mySwiper = new Swiper('.swiper-container', {
        //     // slidesPerView: 1,
        //     // slidesPerGroup: 1,
        //     // speed: 1000,
        //     // spaceBetween: 30,
        //     //freeMode: true,
        //     loop: true,
        //     // effect : 'fade',
        //     // fadeEffect: {
        //     //     crossFade: true,
        //     // },
        //     noSwiping : true,
        //     autoplay: 400000,
        //     // touchRatio:0.01,
        //     autoplayDisableOnInteraction:false,
        //     pagination: '.swiper-pagination',
        //     paginationClickable :true, 
        //     // allowTouchMove: false
        // });
        function newtable() {
            var win = $(".data-table"),
                scrollAreaEl = $('.t_r_content'),
                leftFreezeEl = $('.t_l_freeze'),
                leftTableEl = leftFreezeEl.find('table'),
                rightTableEl = $('.t_r_t table');


            //动态计算容器最大高度
            function adjustHeight() {
                var winHeight = win.height(),
                    tableHeight = winHeight - 65;
                console.log(tableHeight)
                leftFreezeEl.height();
                scrollAreaEl.height(tableHeight);
            }
            // setTimeout(
            //     function(){
            //         adjustHeight()
            //     },2000
            // )
            adjustHeight();
            win.on('resize', adjustHeight);

            //设置iscroll
            var myScroll = new IScroll('.t_r_content', {
                scrollX: true,
                scrollY: true,
                probeType: 3
            });
            var event;
            //阻止默认滚动
            scrollAreaEl.on('touchmove mousewheel', function (e) {
                event = e;
                e.preventDefault();
            });

            //固定上左表头的滚动
            myScroll.on('scroll', updatePosition);
            myScroll.on('scrollEnd', updatePosition);

            function updatePosition() {
                console.log(myScroll.y)
                var a = myScroll.y;
                var b = myScroll.x;
                // $(".t_r_t table").css('transform', 'translate(0px, ' + a + 'px) translateZ(0px)');
                leftTableEl.css('transform', 'translate(0px, ' + a + 'px) translateZ(0px)');
                rightTableEl.css('transform', 'translate(' + b + 'px, 0px) translateZ(0px)');
            }

            
        }
    </script>
</body>

</html>